* {
    margin: 0;
    padding: 0;
}

html {
    width: 100%;
    height: 100%;
}

body {
    height: 100%;
    display: flex;
    flex-direction: column;
    line-height: 1.15;
    background: #eee;
}

.container {
    width: 355px;
    margin: 0 auto;
}

.userName {
    height: 200px;
    width: 100%;
    padding: 25px 30px 20px 20px;

    .avatar {
        width: 120px;
        height: 120px;
        border-radius: 50%;
    }

    .icon-xiayiye1 {
        font-size: 20px;
    }

    .nickname {
        font-size: 30px;
    }

    .sign {
        margin-top: 15px;
        color: #555;
    }
}

.clockTotal {
    width: 100%;
    padding: 20px 15px;
    .clockBtn {
        background-color: rgb(161, 220, 244);
        padding: 10px 5px 5px 5px;
        border-radius: 40px;
    }
}

.dynamic {
    height: 80px;
    width: 100%;
    line-height: 80px;
    padding: 0 15px;
}

.sportData {
    height: 170px;
    width: 100%;
    padding: 10px 15px;
    .totalData{
        margin-top: 10px;
        padding-bottom: 10px;
        
        .dashed{
            height: 90px;
            width: 1px;
            border-right: 2px dashed #ccc;
        }
    }
}

.sportBadge {
    width: 100%;
    padding: 20px 15px;
    .sportBadge-bottom{
        margin-top: 10px;
        .icon-xiayiye1{
            margin-top: 10px;
        }
    }
}
.badgeTotal{
    img{
        height: 90px;
        width: 90px;
    }
}